背景をグラデーションする 2

■ グラデーションをタテにする

前回は、背景をヨコにグラデーションして遊んでみした。
今回は、背景をタテにグラデーションして遊んでみます。

背景をタテにグラデーションする
filter:alpha(opacity=属性値,finishopacity=属性値,style=属性値,startx=属性値,finishy=属性値);

属性値には「数字」が入ります。

前回のパターンに、「startx」「finishy」が追加されました。

まず、「startx」ですが、タテのグラデーションのときは、
この数字は「100」に設定しておきます。

つぎに「finishy」ですが、これはタテのグラデーションの度合いを設定します。
（数字は1から49まで設定できます）

入力ソースはこちら。

これをベースに少しずつ変えてみましょう。

「finishy=40」のとき。

入力ソース。

「td」にも設定できます。

入力ソース。

<table cellspacing="0" cellpadding="5" width="190" height="80" style="border:1px solid #0066ff;">
<tr><td width="100%" height="30%" style="background-color:#ccffff;filter:alpha(opacity=100,finishopacity=30,style=1,startx=100,finishy=10);"></td></tr> width="100%" height="70%"></td></tr></table>

次回は、スタイルシートをつかって文字をカスタマイズします。